<template>
  <div class="box">
    <div class="box1">
      <van-nav-bar
        title="购买藏品"
        left-text="返回"
        left-arrow
        @click-left="onClickLeft"
      />
    </div>
    <div class="box2">
      <van-card
        :num="Collection.count"
        :price="Collection.sell"
        :desc="Collection.name"
        title="藏品信息"
        :thumb="Collection.imgsrc"
      />
    </div>

    <div class="box3">
      <van-goods-action>
        <van-goods-action-icon icon="chat-o" text="客服" @click="openService" />
        <van-goods-action-icon icon="cart-o" text="购物车" @click="openCar" />
        <van-goods-action-button
          type="warning"
          text="加入购物车"
          @click="addCar"
        />
        <van-goods-action-button type="danger" text="立即购买" @click="shop" />
      </van-goods-action>
    </div>
  </div>
</template>

<script>
import { Toast } from 'vant';
import QqntiqueauthApi from "@/api/Qqntiqueauth/QqntiqueauthApi"
import ShopApi from "@/api/Shop/ShopApi"
import OrderApi from "@/api/Order/OrderApi"
export default {
  name: "Shop",
  data() {
    return {
        Collection: {},
    }
  },
  created(){
    this.querySatatus1ById(localStorage.getItem("cId"));
  },
  methods: {
    querySatatus1ById(id){
        QqntiqueauthApi.queryCoolectionById(id).then(res => {
            console.log(res.data.data)
            this.Collection=res.data.data
        })
    },
    onClickLeft() {
      this.$router.push({ path: "/frontHome/index" });
    },
    openService() {
      // console.log("客服");
      if(sessionStorage.getItem("userId") == null){
        Toast.fail('用户还未登录请登录');
        this.$router.push({name: 'Login'})
        return;
      }
      this.$router.push({name: 'KeFu'})
    },
    openCar() {
      // console.log("打开购物车");
      
      if(sessionStorage.getItem("userId") == null){
        Toast.fail('用户还未登录请登录');
        this.$router.push({name: 'Login'})
        return;
      }
      this.$router.push({name: 'ShopChe'})
    },
    addCar() {
      // console.log("加入购物车");
      OrderApi.insertShopChe(this.Collection.id, sessionStorage.getItem("userId"), this.Collection.sell).then(res =>{
        if(res.data.code == 0){
            Toast.fail(res.data.message);
            if(res.data.message == '用户还为登录请登录'){
              this.$router.push({name: 'Login'})
              return;
            }
            
        }else {
          Toast.success(res.data.message);
          this.querySatatus1ById(localStorage.getItem("cId"));
        }

      })
    },
    shop() {
      console.log("正在购买");
      ShopApi.goShop(this.Collection, sessionStorage.getItem("userId")).then(res => {
        console.log(res.data)
        if(res.data.code == 0){
            Toast.fail(res.data.message);
            if(res.data.message == '用户还为登录请登录'){
              this.$router.push({name: 'Login'})
            }
            
        }else {
          Toast.success(res.data.message);
          this.querySatatus1ById(localStorage.getItem("cId"));
        }
      })
    },
  },
};
</script>

<style scoped>
.box3 {
    padding: 10px 10px;
}
</style>